<template>
    <div class='c_bbox'>
        <template v-for="item in shuju" :key=item.username>
            <div class="c_box" @click="tiaozhuan">
                <div style="width:90%;margin-left:5%;position: relative; top: 13px;">
                    <div class="c_guanli">订单管理<span style="color:#7c7676; font-size: 13px; line-height: 20px;">{{item.messagetime}}</span></div>
                    <div class="c_mess">
                        <div style="width:84%;position: relative; left: 8%; top: 10px; border-radius: 8px;">
                            <p>你的退款已完成</p>
                            <p>订单编号{{item.OrderNo}}，退款金额${{item.refundmoney}}已经退</p>
                            <p>回到你的支付宝账户，请至支付宝订单查看...</p>
                        </div>
                    </div>
                </div>
            </div>
        </template>
    </div>
</template>
<script lang="ts" setup>
    import { ref } from 'vue';
    import { getsystemmessagelist } from "@/api/messagelist"
    import {useRouter} from 'vue-router';
    const router = useRouter();
    let shuju=ref([])
    getsystemmessagelist().then((res:any)=>{
        // console.log(res.data.data)
        shuju.value=res.data.data
    })
    const tiaozhuan=()=>{
        router.push({
            path:'/orderlist/fefunddetail'
        })
    }
</script>
<style scoped>
    .c_bbox{
        width: 100%;
        height: 650px;
        background-color: #f2f2f2;
        overflow-y: auto;
    }
    .c_box{
        background-color: white;
        width: 88%;
        height: 160px;
        margin: 20px auto;
        border-radius: 13px;
    }
    .c_guanli{
        color: black;
        width: 100%;
        height: 30px;
    }
    .c_guanli span{
        position: absolute;
        right: 0px;
    }
    .c_mess{
        width: 100%;
        margin: auto;
        height: 100px;
        background-color: #f9f9f9;
        color: #7c7676;
        font-size: 13px;
        line-height: 25px;
    }
</style>